 <template lang="html">
  <div class="">
    <div class="search">
        <div class="input">
            <p>
              <label>手机号：</label>
              <el-input placeholder="请输入手机号" v-model="pageData.tel"></el-input>&nbsp;&nbsp;
             <label>订单状态：</label>
              <el-input v-model="pageData.orderStatus"></el-input>&nbsp;&nbsp;
              <label>物流单号：</label>
              <el-input placeholder="请输入物流单号" v-model="pageData.wlNo"></el-input>&nbsp;&nbsp;
              <label>订单编号：</label>
              <el-input placeholder="请输入订单编号" v-model="pageData.orderNo"></el-input>&nbsp;&nbsp;
            </p>
            <p><el-button type="primary" class="se" style="margin-left:10px;" @click="search" @keyup.enter="serach">搜索</el-button></p>
        </div>
    </div>
    <!-- <div class="add">
      <el-button type="primary" @click="add">新增评估师</el-button>
      <el-button type="danger" @click="del">批量删除</el-button>
      :list="list" :state="true" v-loading="listLoading"   @changeData="selectionVal" @sizeChange="handSize"
    </div> -->
    <tableVue :list="list" :total="total" @changeData="selectionVal"  @sizeChange="handSize" v-loading="loading">
        <slot>
          <el-table-column label="操作" align="center">
              <template slot-scope="scope">
                <el-button
                v-if="scope.row.orderStatus == 1"
                  size="mini"
                  @click="compile(scope.row)">详情
                </el-button>
                <el-button
                  v-if="scope.row.orderStatus == 0"
                  size="mini"
                  type='success'
                  @click="takeAddress(scope.row)">接单
                </el-button>
                <!-- <el-button
                  size="mini"
                  type="danger"
                  class="del"
                  @click="del(scope.row,2)">删除</el-button> -->
              </template>
          </el-table-column>
        </slot>
    </tableVue>


  </div>
</template>

<script>
  import Data from './index.js'
  import dialogVue from '@/components/dialog.vue'
  import tableVue from '@/components/alltable.vue'
    import {
    getluxuryList,
    takeOrder,
  } from '@/api/appraiserAdmin/appraiserAdmin'
  export default {
    components : {
      tableVue,
      dialogVue
    },
    data () {
      return JSON.parse(JSON.stringify(Data))
    },
    mounted(){
         let data ={
                current:1,
                size:10
            }
        this.getOrderFormList(data)
    },
    methods:{
        getOrderFormList(data){

            getluxuryList(data).then(res=>{
                if(res.data.code=="OK"){
                    this.loading = false;
                    this.list.tbody = res.data.data.records
                    this.total = res.data.data.total;
                }else{
                    this.loading = false;
                    this.$message.error(res.data.message)
                }
            })
        },
        handSize(val){
                let data ={
                    current:val,
                    size:10
                }
             this.getOrderFormList(data)
        },
        selectionVal(val){
             let data ={
                    current:val,
                    size:10
                }
             this.getOrderFormList(data)
        },
        search(){
            let obj ={}
               this.pageData.tel&&(obj.contactTel=this.pageData.tel)
               this.pageData.orderStatus&&(obj.orderStatus=this.pageData.orderStatus)
               this.pageData.wlNo&&(obj.logisticsNo=this.pageData.wlNo)
               this.pageData.orderNo&&(obj.orderNo=this.pageData.orderNo)
            this.getOrderFormList(obj)
        },
        takeAddress(data){
            let obj={
                consignOrderId:data.orderId
            };
            takeOrder(obj,"POST").then(res=>{
                if(res.data.code=="OK"){
                    this.$router.push("/appraiser/luxuryMenu/luxuryWorkOrder")
                }else{
                    this.$message.error(res.data.message)
                }
            })
        },
        compile(data){

            this.$router.push({path:'/appraiser/myorder/orderDetails',query:{id:data.orderId,key:'luxuryOrderForm'}})
        }

    }
  }
</script>

<style scoped>
.search {
  width: 100%;
  background-color: #fff;
  padding:20px;
  box-sizing: border-box;
  margin-top: 10px;
}
.input {
  /* width: 300px; */
  display: flex;
  flex-wrap: wrap;
}
.input p {
  margin-top: 10px;
}
label {
  line-height: 40px;
  color: #333;
  margin: 0 10px;
}
.el-input {
  width:200px;
  height:20px;
}
.add {
  margin-top: 10px;
  padding-left: 14px;
}
.se {
  margin-left: 20px;
}
.confirm {
  position: absolute;
  bottom: -1px;
  right: 100px;
}
.region{
	width:120px;
}
</style>
